﻿@page "/Admin/MemberData"
@using iOSClub.Data.DataModels

<PageTitle>成员数据 - iAdmin</PageTitle>

<InputFile id="fileInput" OnChange="@UploadFiles" hidden multiple/>
<Modal Title="@("下载数据")"
       Visible="@_visible"
       OnCancel="@HandleCancel"
       Footer="null">
    <Space>
        <SpaceItem>
            <Button Type="@ButtonType.Primary" OnClick="@CsvDownload">下载Csv文件</Button>
        </SpaceItem>
        <SpaceItem>
            <Button Type="@ButtonType.Primary" OnClick="@JsonDownload">下载Json文件</Button>
        </SpaceItem>
        <SpaceItem>
            <Button Type="@ButtonType.Primary" OnClick="@HandleCancel">取消</Button>
        </SpaceItem>
    </Space>

</Modal>

<Drawer Closable="true" Width="600" Visible="Visible"
        Title='"更改"' OnClose="@CloseTable"
        Mask="false">
    <Template Style="height:90%">
        <MemberTable CallBack="() => Visible = false" ChangeModel="ChangeModel"/>
    </Template>
</Drawer>

@if (Member.IsAdmin())
{
    <PageView ContextStyle="padding:10px;"
              FullScreen="true"
              OnDelete="@(() => Nav.NavigateTo("/Centre"))"
              Title="成员数据">
        <Extra>
            <Space>
                <SpaceItem>
                    <Button Type="@ButtonType.Primary" OnClick="@FileDownload">下载文件</Button>
                </SpaceItem>
                <SpaceItem>
                    <div class="desktop-phone-flex">
                        <Upload Name="files">
                            <label class="ant-btn" for="fileInput">上传Json数据</label>
                        </Upload>
                    </div>
                </SpaceItem>
                <SpaceItem>
                    <div class="desktop-phone-flex">
                        <Button Danger OnClick="@RemoveAll">删除所有数据</Button>
                    </div>
                </SpaceItem>
                <SpaceItem>
                    <Button Type="@ButtonType.Primary" OnClick="@Flushed">刷新</Button>
                </SpaceItem>
                <SpaceItem>
                    <div class="desktop-phone-flex">
                        @if (DeleteModels.Count > 0)
                        {
                            <Button Type="@ButtonType.Primary" OnClick="@Recover">恢复</Button>
                        }
                    </div>
                </SpaceItem>
            </Space>
        </Extra>
        <Context>
            <Tabs Centered @bind-ActiveKey="ActiveKey">
                <TabPane Tab="成员数据" Key="1">
                    <Flex Justify="center" Gap="large">
                        <Space>
                            <SpaceItem>
                                <SimpleSelect Value="@SearchItem" ValueChanged="async s => await GetDataFromItem(s)">
                                    <SelectOptions>
                                        @foreach (var item in SearchItems)
                                        {
                                            <SimpleSelectOption Value="@item" Label="@item"/>
                                        }
                                    </SelectOptions>
                                </SimpleSelect>
                            </SpaceItem>
                            <SpaceItem>
                                <Search Placeholder="请输入搜索项" EnterButton="@("搜索")"
                                        Value="@SearchValue" Size="large" ValueChanged="async s => await GetData(s)"/>
                            </SpaceItem>
                        </Space>
                        <Statistic GroupSeparator=" " Title="当前成员" Value="@Total" TValue="int" Class="desktop-phone">
                            <PrefixTemplate>
                                <Icon Type="team" Theme="outline"/>
                            </PrefixTemplate>
                        </Statistic>
                    </Flex>
                    <Table TItem="StudentModel" DataSource="@ShowData" Responsive
                           PageIndex="PageIndex" PageSize="PageSize" Total="Total"
                           PageIndexChanged="PageIndexChanged"
                           PageSizeChanged="PageSizeChanged">
                        <PropertyColumn Title="姓名" Property="c => c.UserName"/>
                        <PropertyColumn Title="学号" Property="c => c.UserId"/>
                        <PropertyColumn Title="学院" Property="c => c.Academy"/>
                        <PropertyColumn Title="政治面貌" Property="c => c.PoliticalLandscape"/>
                        <PropertyColumn Title="性别" Property="c => c.Gender"/>
                        <PropertyColumn Title="专业班级" Property="c => c.ClassName"/>
                        <PropertyColumn Title="手机号码" Property="c => c.PhoneNum"/>
                        <ActionColumn Title="操作">
                            <Space>
                                <SpaceItem>
                                    <Button Danger OnClick="@(() => Delete(context))">删除</Button>
                                </SpaceItem>
                                <SpaceItem>
                                    <div class="phone-left-display">
                                        <Button Danger OnClick="@(() => OpenTable(context))">更改</Button>
                                    </div>
                                </SpaceItem>
                            </Space>
                        </ActionColumn>
                    </Table>
                </TabPane>
                <TabPane Tab="历年人数" Key="2">
                    <AntDesign.Charts.Line Data="_yearData" Config="_yearConfig"/>
                    <div style="text-align: center;color: #00000073">此数据统计对象为在校学生</div>
                    <div style="text-align: center;color: #00000073">[1] 因历史原因，2019学年,2021学年为预估值</div>
                    <div style="text-align: center;color: #00000073">[2] 本年9月1日至次年6月30日为一个学年</div>
                </TabPane>
                <TabPane Tab="学院分布" Key="3">
                    <AntDesign.Charts.Pie Data="_collegeData" Config="_collegeConfig"/>
                    <Divider/>
                    <GridRow Gutter="(16, 16)">
                        @foreach (var item in _collegeData)
                        {
                            <GridCol Xs="12" Sm="12" Md="8" Lg="6" Xl="6" Xxl="6">
                                <Card Title="@item.Type" Style="border-radius: 10px;box-shadow: 0 4px 6px rgba(0, 0, 0, 0.05);">
                                    <Extra>
                                        <Button Type="link" OnClick="() => CollegeMore(item.Type)">更多</Button>
                                    </Extra>
                                    <ChildContent>
                                        <Statistic GroupSeparator=" " Title="当前成员" Value="@item.Value" TValue="int">
                                            <PrefixTemplate>
                                                <Icon Type="team" Theme="outline"/>
                                            </PrefixTemplate>
                                        </Statistic>
                                    </ChildContent>
                                </Card>
                            </GridCol>
                        }
                    </GridRow>
                </TabPane>
                <TabPane Tab="年级分布" Key="4">
                    <AntDesign.Charts.Bar Data="_gradeData" Config="_gradeConfig"/>
                </TabPane>
                <TabPane Tab="男女比例" Key="5">
                    <AntDesign.Charts.Pie Data="_genderData" Config="_collegeConfig"/>
                    <div style="text-align: center;">@GenderWord</div>
                </TabPane>
                <TabPane Tab="政治面貌" Key="6">
                    <AntDesign.Charts.Column Data="_landscapeData" Config="_landscapeConfig"/>
                </TabPane>
            </Tabs>
        </Context>
    </PageView>
}
else if (string.IsNullOrEmpty(Member.UserId))
{
    <Result Status="403"
            Title="未能找到当前页面"
            Style="padding: 20px"
            SubTitle="这里空空如也"/>
    <div style="text-align: center">
        <Button Type="primary" OnClick="@(() => Nav.NavigateTo("/Login"))">试试登录一下?</Button>
    </div>
}

<style>
    body{
        height: 100%;
    }

    .ant-drawer-content {
        border-radius: 0 20px 20px 0;
    }
</style>